<?php
/*
 * [gen_recordform]
 *
 */

namespace WebApper\Shortcode;

class GeneratorRecordForm extends Generator {
	
    /**
     * Define shortcode properties
     *
     */
	protected $shortcode = 'generator_recordform';

    /**
     * Handles the add post shortcode
     *
     * @param array $atts
     */
    public function shortcode( $atts ) {

		// Set data need for form
		$this->get_gen_form_data()

		?>
		<hr />
		<div class="alert alert-info fade in">
			<button type="button" class="close" data-dismiss="alert">&times;</button>
			<strong>How To!</strong> Use this tool to create a [recordform] shortcode. Fill out the form, update the shortcode &amp; copy the shortcode to your desired page. Be sure to go through each tab!
		</div>
		
		<form name="generator_form" id="generator_form" action="" method="post" novalidate>
		
			<div class="tabbable">
			
				<ul class="nav nav-tabs">
					<li class="active"><a href="#tab-form-settings" data-toggle="tab">Form Settings</a></li>
					<li><a href="#tab-form-view" data-toggle="tab">Form View</a></li>
					<li><a href="#tab-form-fields" data-toggle="tab">Form Fields</a></li>
					<li><a href="#tab-form-messages" data-toggle="tab">Form Messages</a></li>
					<li><a href="#tab-form-attributes" data-toggle="tab">Attribute reference</a></li>
				</ul>
				
				<div class="tab-content" style="min-height:305px;">
				
					<div class="tab-pane row active" id="tab-form-settings">
						<div class="span4">
							<label for="id"><strong>Form ID:</strong></label>
							<input type="text" name="id">
                            <span class="help-block">A unique ID to use for the shortcode. Must be alphanumeric: contain only lowercase letters, numbers and underscores(_).</span>
						</div>
						<div class="span4">
							<label for="usercap"><strong>Minimum user capability:</strong></label>
							<select name="usercap">
								<?php echo $this->wp_user_caps; ?>
							</select>
							<span class="help-block">The minimum user capability required to view the indextable.</span>
						</div>
						<div class="span4">
							<label for="ajax"><strong>Use Ajax:</strong></label>
							<label for="ajax" class="radio">
								<input type="radio" name="ajax" id="ajax1" value="true" checked> Use ajax
							</label>
							<label for="ajax" class="radio">
								<input type="radio" name="ajax" id="ajax2" value="false"> Don't use ajax
							</label>
							<span class="help-block">Whether to submit the form via ajax. Without ajax, the page will reload every time the form is submitted.</span>
							<label for="novalidate"><strong>Use validation:</strong></label>
							<label for="novalidate" class="radio">
								<input type="radio" name="novalidate" id="novalidate1" value="true" checked> Use browser validation
							</label>
							<label for="novalidate" class="radio">
								<input type="radio" name="novalidate" id="novalidate2" value="false"> Don't use browser validation
							</label>
							<span class="help-block">Whether to let browsers pre-validate form submissions before they are submitted.</span>
						</div>
					</div><!-- /.tab-pane -->
					
					<div class="tab-pane row" id="tab-form-view">
						<div class="span4">
							<label for="view"><strong>View:</strong></label>
							<select name="view">
								<option value="SideBySide">SideBySide</option>
								<option value="Vertical">Vertical</option>
								<option value="Inline">Inline</option>
								<option value="Search">Search</option>
								<option value="Modal">Modal</option>
							</select>
							<span class="help-block">The view to use to display the form.</span>
							<label for="placeholders"><strong>Placeholders:</strong></label>
							<label for="placeholders" class="radio">
								<input type="radio" name="placeholders" id="placeholders1" value="true"> Use labels as placeholders
							</label>
							<label for="placeholders" class="radio">
								<input type="radio" name="placeholders" id="placeholders2" value="false" checked> Don't use labels as placeholders
							</label>
							<span class="help-block">Whether to use field labels as placeholders, overriding field's placeholder setting.</span>
						</div>
						<div class="span4">
							<label for="modalbtn"><strong>Modal button label:</strong></label>
							<input type="text" name="modalbtn" disabled>
							<span class="help-block">The label to use for the button that opens the modal.</span>
							<label for="modalheading"><strong>Modal Heading:</strong></label>
							<input type="text" name="modalheading" class="span4" disabled>
							<span class="help-block">The heading to use for the modal.</span>
						</div>
						 <div class="span4">
							<label for="submitlabel"><strong>Submit button label:</strong></label>
							<input type="text" name="submitlabel">
							<span class="help-block">The label to use for the form submit button. Default is 'Submit'.</span>
						</div>
				   </div><!-- /.tab-pane -->
					
					<div class="tab-pane row" id="tab-form-fields">
						<div class="span12">
							<div class="alert alert-info fade in">
								<button type="button" class="close" data-dismiss="alert">&times;</button>
								<strong>How To!</strong> Use the Ctrl/Cmd button to select multiple options, or deselect an option on multiselect boxes.
							</div>
						</div>
						<div class="span4">
							<label for="posttype"><strong>Post Type:</strong></label>
							<select name="posttype">
								<option></option>
								<?php echo $this->web_apper_cpts_options; ?>
							</select>
							<span class="help-block">The post type to use with the form.</span>
							<label for="fieldset"><strong>Fieldset:</strong></label>
							<select name="fieldset" multiple="multiple">
								<?php echo $this->web_apper_fieldsets_options; ?>
							</select>
							<span class="help-block">The set of fields to include in the form.</span>
						</div>
						<div class="span4">
							<label for="include"><strong>Include fields:</strong></label>
							<select name="include" multiple="multiple">
								<?php echo $this->web_apper_fields_options; ?>
							</select>
							<span class="help-block">Individual fields to include in the form.</span>
							<label for="exclude"><strong>Exclude fields:</strong></label>
							<select name="exclude" multiple="multiple" disabled></select>
							<span class="help-block">Individual fields to exclude from the form, e.g., exclude a field in one of the selected fieldsets.</span>
						</div>
						<div class="span4">
							<label for="titlefield"><strong>Post title field:</strong></label>
							<select name="titlefield" multiple="multiple"></select>
							<span class="help-block">The field to use for the post title. Try using fields with unique values like name and/or address. This will be the post title seen if the post type is visible in the WP Administration area.</span>
						</div>
                    </div><!-- /.tab-pane -->
	
					<div class="tab-pane row" id="tab-form-messages">
						<div class="span4">
							<label for="successsave"><strong>Submit successful message:</strong></label>
							<input type="text" name="successsave" class="span4">
							<span class="help-block">The message to display upon a successful form submission. Default 'Submission successful!'</span>
							<label for="failuresave"><strong>Submit unsuccessful message:</strong></label>
							<input type="text" name="failuresave" class="span4">
							<span class="help-block">The message to display upon an unsuccessful form submission. Default 'Submission unsuccessful.'</span>
						</div>
					</div><!-- /.tab-pane -->
	
					<div class="tab-pane row" id="tab-form-attributes">
						<div class="span12">
							<h4>Form shortcode attribute reference</h4>
							<dl>
								<dt>id:</dt><dd> The unique ID to use for the form. Default: none. Required.</dd>
								<dt>usercap:</dt><dd> The minimum user capability required to access the Form. OPTIONS: 'logged_out', 'read', 'edit_posts', 'edit_others_posts', 'edit_users', 'edit_pages', 'edit_plugins'. Default: 'read'.</dd>
								<dt>posttype:</dt><dd> The cutom post type (ID) to display. Default: none. Required.</dd>
								<dt>fieldset:</dt><dd> The set of fields to include in the indextable. Default: none. Required if 'include' is not specified. You may use one or both.</dd>
								<dt>include:</dt><dd> field-id's of individual fields to include in the indextable. Default: none. Required if 'fieldset' is not specified. You may use one or both.</dd>
								<dt>exclude:</dt><dd> field-id's of individual fields to exclude in the indextable. Default: none</dd>
								<dt>titlefield:</dt><dd> The field to use for the post title. Default: none. Required.</dd>
								<dt>view:</dt><dd> The styles used to display the form. OPTIONS: 'SideBySide', 'Vertical', 'Inline', 'Search', 'Modal'. Default: 'SideBySide'.</dd>
								<dt>placeholders:</dt><dd> Whether to use field labels as placeholders. OPTIONS: true, false.</dd>
								<dt>submitlabel:</dt><dd> The label to use for the submit button. Default: 'Submit'.</dd>
								<dt>successsave:</dt><dd> The message to display upon successful save.</dd>
								<dt>failuresave:</dt><dd> The message to display upon unsuccessful save.</dd>
								<dt>ajax:</dt><dd> Whether to submit the form via ajax. OPTIONS: true, false.</dd>
								<dt>modalbtn:</dt><dd> The label to use for the trigger modal button. Default: none. Required if 'view=Modal'.</dd>
								<dt>modalheading:</dt><dd> The heading to use for the modal. Default: none. Required if 'view=Modal'.</dd>
								<dt>novalidate:</dt><dd> Whether to add a 'novalidate' attribute to the form. OPTIONS: true, false. Default: false.</dd>
							</dl>
						</div>
					</div><!-- /.tab-pane -->
	
				</div><!-- End inner .tab-content -->
				
			</div><!-- End inner .tabbable -->
			
			<hr>
			
			<div class="row">
				<button type="submit" class="btn btn-large btn-primary span4 offset4">Update Shortcode</button>
			</div> 
	
		</form>
	
		<textarea id="shortcode" rows="3" onClick="this.select();" style="width:100%; text-align: center; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;" class="well">[recordform]</textarea>
		<?php
		
		$this->add_generator_js();

	}

}

$initialize = new GeneratorRecordForm(); 

?>